<template>
    <div class="consensus-activity-earnings">
        <c-title text="收益记录"></c-title>
        <div class="list" v-if="list&&list.length!==0">
            <div class="list-item" v-for="item in list" :key="item.id">
                <div class="between">
                    <span class="title-left">{{ item.reward_type_name }}
                     </span>
                    <span class="title-right">{{ item.dividend_amount }}</span>
                </div>
                <div class="between" style="margin-top: 0.5625rem;">
                    <span>ID{{item.activity_id}}{{ item.has_one_activity.activity_name }}【{{item.has_one_activity&&item.has_one_activity.activity_sn}}】
                    </span>
                    <span class="c-AAAAB3">{{ item.created_at }}</span>
                </div>
                <div class="line"></div>
            </div>
        </div>
    </div>
</template>

<script>
import { scrollMixin } from "../../utils/mixin";
export default {
    mixins: [scrollMixin],
    data() {
        return {
            list: [],
            total_page: 1,
            isLoadMore: true,
            page: 1,
        };
    },
    activated() {
        this.getData();
    },
    methods: {
        getMoreData() {
            this.isLoadMore = false;
            if (this.page >= this.total_page) {
                return;
            }
            let page = this.page + 1;
            this.getData(page);
        },
        getData(page = 1) {
            $http.get("plugin.wise-yuan-trade.frontend.my.activity-bonus-log", { page }, "").then(res => {
                this.isLoadMore = true;
                if (res.result) {
                    let data = res.data;
                    (page==1)?(this.list=data.data):(this.list=this.list.concat(data.data));
                    this.total_page = data.last_page;
                    this.page = data.current_page;
                } else {
                    this.$toast(res.msg);
                }
            })
        }
    }
};
</script>

<style scoped lang="scss">
.consensus-activity-earnings {
  padding: 0.625rem 0.75rem;

  .list {
    padding: 0.9375rem 0.75rem 1.0938rem;
    background: #fff;
    border-radius: 0.625rem;
  }

  .c-AAAAB3 {
    color: #aaaab3;
  }

  .title-right {
    color: #f15353;
  }

  .between {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .line {
    width: 100%;
    height: 1px;
    background: #f0f0f1;
    margin-top: 1.0625rem;
    margin-bottom: 0.9375rem;
  }

  .title-left {
    font-weight: bold;
    font-size: 0.875rem;
  }
}
</style>
